<%@page contentType="text/html; charset=utf-8"%>
<%@include file="/WEB-INF/views/common/taglibs.jspf" %>
<title>系统用户管理</title>

<div style="padding:12px;">
	<div class="row">
		<div class="col-xs-12">
			<!-- PAGE CONTENT BEGINS -->
				<form class="form-horizontal" id="form" method="get">
					<input type="hidden" value="${id}" name="id">
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="username">用户名:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="clearfix">
								<input type="text" name="username" id="username" class="col-xs-12 col-sm-5" />
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="password">密码:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="clearfix">
								<input type="password" name="password" id="password" class="col-xs-12 col-sm-5" />
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="password2">确认密码:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="clearfix">
								<input type="text" name="password2" id="password2" class="col-xs-12 col-sm-5" />
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="mobile_phone_number">移动电话:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="input-group">
								<span class="input-group-addon">
									<i class="ace-icon fa fa-phone" style="font-size:15px;"></i>
								</span>
								<input type="text" name="mobile_phone_number" id="mobile_phone_number" style="width:235px;">
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="email">邮箱地址:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="input-group">
								<span class="input-group-addon">
									<i class="ace-icon fa fa-envelope" style="font-size:13px;"></i>
								</span>
								<input type="text" name="email" id="email" style="width:235px;">
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="status">状态:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="clearfix" style="height:33px;line-height: 33px;">
								<label class="line-height-1 blue">
									<input name="status" checked="checked" value="normal" type="radio" class="ace" />
									<span class="lbl"> 正常</span>
								</label>
								<label class="line-height-1 blue">
									<input name="status" value="blocked" type="radio" class="ace" />
									<span class="lbl"> 禁用</span>
								</label>
							</div>
						</div>
					</div>
					<div class="form-group">
						<label class="control-label col-xs-12 col-sm-3 no-padding-right" for="admin">是否管理员:</label>
						<div class="col-xs-12 col-sm-9">
							<div class="clearfix" style="height:33px;line-height: 33px;">
								<label class="line-height-1 blue">
									<input name="admin" checked="checked" value="true" type="radio" class="ace" />
									<span class="lbl"> 是</span>
								</label>
								<label class="line-height-1 blue">
									<input name="admin" value="false" type="radio" class="ace" />
									<span class="lbl"> 否</span>
								</label>
							</div>
						</div>
					</div>
					
				</form>
	
			<!-- PAGE CONTENT ENDS -->
		</div><!-- /.col -->
	</div><!-- /.row -->
</div>
<script type="text/javascript">
var scripts = [null, 
               "${ctx}/static/admin/ace/js/jquery.validate.js",
               "${ctx}/static/js/localization/messages_zh.js",
               null];
$('.page-content-area').ace_ajax('loadScripts', scripts, function() {
	jQuery(function($) {
		var id = "${id}" ;
		if(undefined != id && id != "") {
			$.get("${ctx}/admin/sys/user/get/"+id, function(result){
				$("#form").autofill(result);
			});
		}
		
		
		jQuery.validator.addMethod("phone", function (value, element) {
			return this.optional(element) ||  /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/.test(value);
		}, "请正确填写您的手机号码");
		
		$('#form').validate({
			errorElement: 'div',
			errorClass: 'help-block',
			focusInvalid: false,
			ignore: "",
			rules: {
				username: {
					required: true,
					minlength: 3,
					maxlength: 20
				},
				password: {
					required: true,
					minlength: 3,
					maxlength: 8
				},
				password2: {
					required: true,
					minlength: 3,
					maxlength: 8,
					equalTo: "#password"
				},
				phone: {
					required: true,
					phone: true
				},
				email: {
					required: true,
					email:true
				}
			},
			highlight: function (e) {
				$(e).closest('.form-group').removeClass('has-info').addClass('has-error');
			},
			success: function (e) {
				$(e).closest('.form-group').removeClass('has-error');//.addClass('has-info');
				$(e).remove();
			},
			errorPlacement: function (error, element) {
				if(element.is('input[type=checkbox]') || element.is('input[type=radio]')) {
					var controls = element.closest('div[class*="col-"]');
					if(controls.find(':checkbox,:radio').length > 1) controls.append(error);
					else error.insertAfter(element.nextAll('.lbl:eq(0)').eq(0));
				}
				else if(element.is('.select2')) {
					error.insertAfter(element.siblings('[class*="select2-container"]:eq(0)'));
				}
				else if(element.is('.chosen-select')) {
					error.insertAfter(element.siblings('[class*="chosen-container"]:eq(0)'));
				}
				else error.insertAfter(element.parent());
			},
			submitHandler: function (form) {
			},
			invalidHandler: function (form) {
			}
		});
		
	});
});

</script>
